<template>
  <div class="page-leval">
    <div class="page-leval-header">
      <pk-searchFrom :config="config" @onSearch="onSearch"></pk-searchFrom>
    </div>
    <div class="mt-12 mb-12">
      <div><pk-button size="default" type="primary" :icon="Plus" @click="AddLabel">添加</pk-button></div>
    </div>
    <div class="page-leval-body">
      <pk-table :tableConfig="tableConfig" :data="tableData" :isPage="false">
        <template #options="{row}">
         <div class="flex-row">
            <div class="mr-8"><pk-button  size="small" :icon="Edit" type="primary" @click="setEdit(row)">编辑</pk-button></div>
            <div class="mr-8"><pk-button size="small" @click="HandlerBindPingWei(row)">绑定评委</pk-button></div>
            <div>
              <el-popconfirm
                  class="box-item"
                  title="确认要删除?"
                  confirm-button-text="确认"
                  cancel-button-text="取消"
                  @confirm="HandlerBindDel(row)"
                  placement="top"
                >
                  <template #reference>
                    <pk-button type="danger" size="small" :icon="Delete">删除</pk-button>
                  </template>
                </el-popconfirm>
              </div>
          </div>
        </template>
      </pk-table>
    </div>
    <level-component v-if="isLevel" @onClose="isLevel=false" :curData="curData" @confirm="confirm"></level-component>
  </div>
</template>

<script setup>
import { ref, reactive, onMounted } from 'vue'
import pkSearchFrom from '@/components/pkui/pk-searchItem/pk-searchItem.vue'
import pkTable from '@/components/pkui/pk-table/pk-table.vue'
import pkButton from '@/components/pkui/pk-button/pk-button.vue'
import levelComponent from './component/additem.vue'
import { Plus, Edit, Delete } from '@element-plus/icons-vue'
import { useRouter } from 'vue-router'
import { dutiesGetList, dutiesDel } from '@/api/api'
import { getTime } from '@/utils/utils'
const router = useRouter()
const total = ref(0)
const querySearch = ref({})
const page = ref({
  pageNum: 1,
  pageSize: 10
})
const curData = ref({})
const config = ref([
  {
    label: '名称',
    type: 'input',
    prop: 'name'
  }
])
const isLevel = ref(false)
const tableData = ref([])
const tableConfig = ref([
  {
    label: '名称',
    prop: 'name'
  },
  {
    label: '权重',
    prop: 'ratio'
  },
  {
    label: '创建时间',
    prop: 'creatorTime'
  },
  {
    label: '修改时间',
    prop: 'lastModifyTime'
  },
  {
    label: '操作',
    type: 'slot',
    slotName: 'options',
    width: '240px',
    fixed:'right'
  }
])

const HandlerBindPingWei = (e) => {
  router.push({
    path: '/admin/leveldetail',
    query: {
      id: e.id,
      name: e.name,
      ratio: e.ratio
    }
  })
}

const HandlerBindDel = (e) => {
  dutiesDel({
    id: e.id
  }).then(res => {
    getList()
  })
}

const AddLabel = () => {
  curData.value = {}
  isLevel.value = true
}

const setEdit = (e) => {
  curData.value = e
  isLevel.value = true
}

const confirm = () => {
  isLevel.value = false
  getList()
}

const onSearch = (e={}) => {
  querySearch.value = e
  getList()
}

const getList = () => {
  dutiesGetList({
    ...page.value,
    ...querySearch.value
  }).then(res => {
    tableData.value = res.resData.map(item => {
      return {
        ...item,
        creatorTime: getTime(item.creatorTime / 1000, 'time'),
        lastModifyTime: getTime(item.lastModifyTime / 1000, 'time')
      }
    })
  }).catch(err => {
    console.log(err)
  })
}

onMounted(() => {
  getList()
})

</script>

<style lang="scss" scoped>

</style>